<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />
    <meta charset="utf-8">
    <title>清单</title>
    <#--<link href="//cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">-->
    <link rel="stylesheet" href="/app/css/ectouch.css" />

    <script src="//do.yunzhijia.com/pub/js/qingjs.js"></script>
    <script src="/app/js/jquery-3.0.0.min.js"></script>
    <script src="/layer/layer.js"></script>
</head>
<body>

<input type="hidden" name="title" id="title" value="清单">
<input type="hidden" name="count" id="count" value="${count}">

<#--是否打折的标记,没有打折就是0 点过打折就是1-->
<input hidden class="isOrNotDisCount" id="isOrNotDisCount" name="isOrNotDisCount" value="0">
<#--打折这后的那个总价-->
<input hidden class="disCountedPrice" id="disCountedPrice" name="disCountedPrice" value="">

<div class="empty_list" style="display: none">
    <div class="empty_list_pic">
        <img src="/app/image/index/Group_EMPTY_LIST.png">
    </div>
    <div class="empty_list_text">
        <em class="add_text_one text_tip">
            暂无清单
        </em>
        <em class="add_text_two text_tip">
            回到首页添加数据吧
        </em>
    </div>
    <a href="/index/${openId}/">
        <div class="empty_list_toadd">
            <em class="add_text_tip">
                添加配置
            </em>
        </div>
    </a>
</div>
<div class="main_body">
    <form>
        <div class="list" style="height: 95%; margin-bottom: 124px;">
        <#if productLists?exists>
        <#list productLists as item >

            <div class="list_item text_kind">
                <#--<input type="hidden" name="productId" id="productId" value="${item.id}">
                <input type="hidden" name="openId" id="openId" value="${item.openId}">-->
                <div>
                    <div class="item_title">
                        <#--<#if ${item.productName}=="1">
                            ${item.productName}
                        <#/if>-->
                        ${item.productName}
                    </div>
                    <div class="item_del" style="display: none" productId="${item.id}">
                        <img src="/app/image/Group_List_Del.png"/>
                    </div>
                </div>


                <div class="list_content text_kind">
                    <div class="content_left_select">
                        <div class="cont_selected">
                            <input type="checkbox" class="check goods-check goodsCheck in-ok" ischeckout="0" openId="${item.openId}" productId="${item.id}" productType="${item.productTypeId}" style="outline: none;outline-offset: 2px;">
                        </div>
                    </div>

                    <div class="content_select_right">
                        <div class="content ">
                            <div class="content_left">
                                <img src="/app/image/${item.titleOneImage}.png"  width="18px" height="18px"/>
                            </div>
                            <div class="content_title">
                            ${item.productTitleOneKey}
                            </div>
                            <div class="content_cont">
                                ${item.productTitleOne}
                            </div>
                        </div>

                        <div class="content ">
                            <div class="content_left">
                                <img src="/app/image/${item.titleTwoImage}.png" width="18px" height="18px"/>
                            </div>
                            <div class="content_title">
                            ${item.productTitleTwoKey}
                            </div>
                            <div class="content_cont">
                                ${item.productTitleTwo}
                            </div>
                        </div>
                        <div class="content ">
                            <div class="content_left">
                                <img src="/app/image/${item.titleThreeImage}.png" width="18px" height="18px"/>
                            </div>
                            <div class="content_title">
                            ${item.productTitleThreeKey}
                            </div>
                            <div class="content_cont">
                            ${item.productTitleThree}
                            </div>
                        </div>
                    </div>
                </div>
                <div class="hr_type">

                </div>
                <div class="item_foot">
                    <div class="item_price text_kind">
                    ${item.productPriceTy}
                    </div>
                    <div class="item_price_discount text_kind dis_counted" style="display: none;">
                    ${item.productPriceTy}
                    </div>
                    <div class="foot_right"  productId="${item.id}">
                        <div class="item_minus">
                            <img src="/app/image/Group_MINUS.png" style="height: 33px;">
                        </div>
                        <input type="tel" pattern="[0-9]*" maxlength="5"  name="count" value="${item.productCount}" class="input_num">
                        <div class="item_plus">

                            <img src="/app/image/Group_PLUS.png" style="height: 33px;">
                        </div>
                    </div>

                </div>
                <input type="hidden" name="aliprice" id="aliprice" value="${item.productPriceAli}">
                <input type="hidden" name="txpricce" id="txpricce" value="${item.productPriceTx}">
            </div>

        </#list>
        </#if>
        </div>
    </form>
</div>
<input type="hidden" class="openId" id="openId" value="${openId}">
<div class="check_list">

    <div class="checkInfo_left">
        <div class="discount" isCount="0">
            <p class="dis_count">点击折扣</p>
        </div>
        <div class="checkInfo_all_select">
            <input type="checkbox" class="check" id="AllCheck" openId="${openId}" style="outline: none;outline-offset: 2px;">
            全选
        </div>
        <ul class="checkInfo_left_ul" >
            <li>阿里云:<span class="_priceSpan" id="ali_price">0.00</span></li>
            <li>腾讯云:<span class="_priceSpan" id="tx_price">0.00</span></li>
        </ul>
        <div class="check_right_ul">
            <span class="_text">合计:</span>
            <span class="toTail_Price right " id="allprice"> 0.00</span>
        </div>
    </div>
</div>

</body>

<script>
    $(function(){
        XuntongJSBridge.call('setWebViewTitle',{'title':'清单'});
        XuntongJSBridge.call('createPop',
                {
                    'popTitle':"更多",
                    'popTitleCallBackId':"",
                    'items':[{'text':'重置','callBackId':'123'},
                        {'text':'导出清单','callBackId':'456'}
                    ]

                },
                function(result){
                    if (result.success == true || result.success == 'true') {
                        var callBackId = result.data ? result.data.callBackId : '';
                        if (callBackId == '123') {
                            window.location.reload();
                        }
                    }
                    if (result.success == true || result.success == 'true') {

                        var callBackId = result.data ? result.data.callBackId : '';
                        var openId = $('#openId').val();
                        if(openId!=null||openId!=0){
                            if (callBackId == '456') {
                                $.get("/getbill/" + openId + "/", function (data) {
                                    // console.log(location.origin + data.fileDownloadUrl);
                                    XuntongJSBridge.call('showFile',
                                            {
                                                'fileName': data.fileName,
                                                'fileExt': data.fileExt,
                                                'fileTime': data.fileTime,
                                                'fileSize': data.fileSize,
                                                'fileDownloadUrl':data.fileDownloadUrl
                                            },
                                            function (result) {
                                                console.log(JSON.stringify(result));
                                            }
                                    );
                                });
                            }
                        }

                    }
                }
        );
        var num=$("#count").val();
        if(num==0){
            $(".empty_list").css("display","block");
            $(".main_body").css("display","none");
            $(".check_list").css("display","none");
        }
        else{
            //点击折扣事件
            $('.discount').click(function () {
                var opid = document.getElementById('openId');
                var openId=opid.value;
                var isOrNotDisCount=document.getElementById('isOrNotDisCount');
                var isOrNotDisCountPrice=isOrNotDisCount.value;
                if(isOrNotDisCountPrice==1){
                    layer.msg("请先重置再输入折扣");
                }
                else if(isOrNotDisCountPrice==0){
                    var discont;
                    layer.prompt({title: '请输入折扣并确认,比如7折则输入数字0.7', formType: 2}, function(text, index){
                        discont=text;

                        layer.close(index);
                        if(isNaN(discont)||discont==0||discont==null)
                        {
                            discont=0;
                        }
                        else {
                            discont=parseFloat(discont.substring(0,4));
                            changeCount(openId,discont);
                            var allprice = 0; //总价
                            $(".list_item").each(function() { //循环每个产品
                                var oprice = 0; //总价

                                $(this).find(".goodsCheck").each(function() { //循环店铺里面的
                                    //云专线特殊，在清单页不计算清单折扣
                                    var productTypeId=$(this).attr("productType");
                                    /*if(){
                                        $(this).prop('checked', false);
                                        $(this).closest(".list_item").find(".item_del").css("display","none");
                                    }*/
                                    if ($(this).is(":checked")) { //如果该产品被选中
                                        $("#isOrNotDisCount").attr("value",1); //标记是否折扣

                                        if(isNaN(num)){
                                            num=1;
                                            $(this).parents(".list_item").find(".input_num").val(1);
                                        }
                                        //云专线类型为4，在清单不计折扣
                                        if(productTypeId!=4){
                                            $(this).parents(".list_item").find('.dis_counted').css("display","block");
                                            var price = parseFloat($(this).parents(".list_item").find(".item_price").text());
                                            /*原价*/
                                            $(this).parents(".list_item").find('.item_price_discount').text(parseFloat($(this).parents(".list_item").find(".item_price").text()).toFixed(2));

                                            var total = price * num*discont; //计算单个产品的总价
                                            /*现价*/
                                            $(this).parents(".list_item").find(".item_price").text(total.toFixed(2));
                                            oprice += total; //计算该店铺的总价
                                        }
                                        else{
                                            $(this).parents(".list_item").find('.dis_counted').css("display","none");
                                            var price = parseFloat($(this).parents(".list_item").find(".item_price").text());
                                            /*原价*/
                                            $(this).parents(".list_item").find('.item_price_discount').text(parseFloat($(this).parents(".list_item").find(".item_price").text()).toFixed(2));

                                            var total = price * num; //计算单个产品的总价
                                            /*现价*/
                                            $(this).parents(".list_item").find(".item_price").text(total.toFixed(2));
                                            oprice += total; //计算该店铺的总价
                                        }


                                    }
                                });
                                //得到每个店铺的总价
                                allprice += oprice; //计算所有店铺的总价
                                $("#allprice").text(allprice.toFixed(2));
                                $("#disCountedPrice").attr("value",allprice.toFixed(2));
                            });
                        }
                    });
                }
            })
            $(".empty_list").css("display","none");
            $(".main_body").css("display","block");
            //单选
            $('.goodsCheck').click(function () {
                var goods = $(this).closest(".list").find(".goodsCheck"); //获取所有产品
                var goodsCheck = $(this).closest(".list").find(".goodsCheck:checked");  //所有的选中产品
                //获取点击商品的ID
                var itemId = $(this).attr("productId");
                var openId = $(this).attr("openId");
                var productTypeId=$(this).attr("productType");
                var checkState=0;
                if($(this).is(':checked')){
                    checkState=1;
                }

                updateProductState(itemId,checkState,openId);
                if($(this).prop("checked") == true){
                    $(this).closest(".list_item").find(".item_del").css("display","block");
                }
                else{
                    $(this).closest(".list_item").find(".item_del").css("display","none");
                }
                if (goods.length == goodsCheck.length) { //如果选中的产品等于所有产品
                    $("#AllCheck").prop('checked', true); //全选按钮被选中
                    totalPrice();
                }
                else { //如果选中的产品不等于所有产品
                    $("#AllCheck").prop('checked', false); //全选按钮也不被选中
                    totalPrice();
                }
            })
            /*全选*/
            $("#AllCheck").click(function() {
                var productState="1";
                var openId=$(this).attr("openId");
                if ($(this).prop("checked") == true) { //如果全选按钮被选中
                    //遍历整个list找到那个productType的是2的
                    //不管他
                    $(".goods-check").prop('checked', true); //所有按钮都被选中

                    $(".item_del").css("display","block");
                    updateAllProductState(productState,openId);
                    totalPrice();
                } else {
                    productState="0";
                    updateAllProductState(productState,openId);
                    $(".goods-check").prop('checked', false); //else所有按钮不全选
                    $(".item_del").css("display","none");
                    totalPrice();
                }

            });
            $('.foot_right').on("blur",'.input_num',function (event) {
                var num = parseInt($(this).val());
                var productId=$(this).parent().attr("productId");
                if(isNaN(num)){
                    num=0;
                }
                if(num<=0||num==""){
                    $(this).val(1);
                    totalPrice();
                    upcount(productId,num);
                }
                else {
                    $(this).val(num);
                    totalPrice();
                    upcount(productId,num);
                }
            });
            $('.foot_right').on('click','.item_plus',function (event) {
                var numInput = $(this).prev();
                var stat_num=parseInt($(this).parent().find('.input_num').val());
                var productId=$(this).parent().attr("productId");

                stat_num=stat_num+1;
                numInput.val(stat_num);
                totalPrice();
                upcount(productId,stat_num);
            });
            $('.foot_right').on('click','.item_minus',function (event) {
                var numInput = $(this).next();
                var productId=$(this).parent().attr("productId");
                var stat_num=parseInt($(this).parent().find('.input_num').val());
                if(stat_num<=1){
                    numInput.val(1);
                    totalPrice();
                    upcount(productId,1);
                }
                else {
                    stat_num=stat_num-1;
                    numInput.val(stat_num);
                    totalPrice();
                    upcount(productId,stat_num);
                }
            });
            $('.list_item').on('click','.item_del',function (event) {
                var productId=$(this).attr("productId");
                deleteProduct(productId);
            });

        }
        /*更新全部状态*/
        function updateAllProductState(productState,openId) {
            $.get("/updateAllProductState/"+productState+"/"+openId,function(data){
            });
        }
        /*更新单个状态*/
        function updateProductState(checkState,openId) {
            $.get("/updateproductcheckstate/"+checkState+"/"+openId,function(data){
            });
        }
        /*更改数量*/
        function upcount(itemId,count) {
            $.get("/updateproductcount/"+itemId+"/"+count,function(data){
            });
        }

        /*更改折扣*/
        function changeCount(openId,discont ) {
            $.get("/changecount/"+openId+"/"+discont+"/",function(data){
            });
        }

        function deleteProduct(itemId) {
            $.get("/removeitem/"+itemId,function(data){
                setTimeout(function () {
                    window.location.reload("/getuserlist/${openId}/" );
                }, 500);
            });
        }
        /*计算总价*/
        function
        totalPrice() {
            var allprice = 0; //总价
            var txallprice=0;
            var aliallprice=0;
            $(".list_item").each(function() { //循环每个产品
                var oprice = 0; //总价
                var tx_price=0;
                var ali_price=0;
                $(this).find(".goodsCheck").each(function() { //循环店铺里面的
                    if ($(this).is(":checked")) { //如果该产品被选中
                        var num = parseInt($(this).parents(".list_item").find(".input_num").val()); //得到产品的数量
                        if(isNaN(num)){
                            num=1;
                            $(this).parents(".list_item").find(".input_num").val(1);
                        }
                        var price = parseFloat($(this).parents(".list_item").find(".item_price").text()); //得到产品的单价*/
                        var txprice=parseFloat($(this).parents(".list_item").find("#txpricce").val());
                        var aliprice=parseFloat($(this).parents(".list_item").find("#aliprice").val());
                        var total = price * num; //计算单个产品的总价
                        var tx=txprice*num;
                        var ali=aliprice*num;
                        oprice += total; //计算该店铺的总价
                        tx_price+=tx;
                        ali_price+=ali;
                    }
                    //$(this).closest(".list_item").find(".item_price").text(oprice.toFixed(2)); //显示被选中产品的店铺总价
                });
                /*var oneprice = parseFloat($(this).find(".item_price").text());
                var onetxprice = parseFloat($(this).find("#txpricce").val());
                var onealiprice = parseFloat($(this).find("#aliprice").val());*/
                //得到每个店铺的总价
                allprice += oprice; //计算所有店铺的总价
                txallprice+=tx_price;
                aliallprice+=ali_price;
            });
            $("#allprice").text(allprice.toFixed(2)); //输出全部总价
            $("#ali_price").text(aliallprice.toFixed(2));
            $("#tx_price").text(txallprice.toFixed(2));
        }
    })


</script>

</html>